<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>DB'S BLOG</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <link href="http://op93pqovl.bkt.clouddn.com/images/blog.ico" rel="icon" type="image/x-icon">
    <link  href="http://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" rel='stylesheet' type='text/css'/>
    <link href="http://op93pqovl.bkt.clouddn.com/css/style.css" rel='stylesheet' type='text/css'/>
    <link th:href="@{/foreground/css/mystyle.css}" href="../../static/foreground/css/mystyle.css" rel='stylesheet'
          type='text/css'/>
    <link href="http://op93pqovl.bkt.clouddn.com/css/dropdown.css" rel='stylesheet' type='text/css'/>
    <link href="http://cdn.bootcss.com/animate.css/3.5.2/animate.min.css" rel="stylesheet">
    <link href="http://cdn.bootcss.com/malihu-custom-scrollbar-plugin/3.1.3/jquery.mCustomScrollbar.min.css" rel="stylesheet">
    <link href="http://op93pqovl.bkt.clouddn.com/css/jquery.emoji.css" rel="stylesheet">
    <!--百度站点统计-->
    <script>
        var _hmt = _hmt || [];
        (function() {
            var hm = document.createElement("script");
            hm.src = "https://hm.baidu.com/hm.js?8bbebf81099e93cb652e9215fa86d98c";
            var s = document.getElementsByTagName("script")[0];
            s.parentNode.insertBefore(hm, s);
        })();
    </script>

</head>
<body>
<div class="header" id="ban" th:include="foreground/common::header"></div><!--头部导航结束-->

<div class="header-bottom" th:include="foreground/common::blogTitle"></div><!--博客标题结束-->
<div class="banner-1" style="background: url(http://op93pqovl.bkt.clouddn.com/images/banner-1.jpg) no-repeat 0px 0px;background-size: 100%">

</div>


<div class="technology" >
    <div class="container">
        <div class="col-md-9 technology-left">
            <div class="tech-no">
                <div class="wthree" th:each="blog:${blogList}">
                    <div class="col-md-6 wthree-left wow fadeInDown" data-wow-duration=".8s" data-wow-delay=".2s" style="width: 250px;height: 250px;">
                        <div class="tch-img">
                            <a th:href="'/blog/'+${blog.id}" href="blog.html">
                                <img th:src="${blog.coverImageName}" src="../../static/foreground/images/f1.jpg"  class="img-responsive" alt="">
                            </a>
                        </div>
                    </div>
                    <div class="col-md-6 wthree-right wow fadeInDown" data-wow-duration=".8s" data-wow-delay=".2s">
                        <h6><a th:href="'/blog/'+${blog.id}" href="blog.html" th:text="${blog.title}">最新博文2</a></h6>
                        <h6>BY <a  th:text="${blog.author}">氧化钡 </a> <span th:text="${#calendars.format(blog.publishTime,'yyyy-MM-dd')}">2017-04-13</span></h6>
                        <p th:text="${blog.summary}" class="summary">Ut enim ad minim veniam, quis nostrud eiusmod tempor incididunt ut labore et dolore magna
                            aliqua exercitation ullamco laboris .</p>
                        <div class="bht1">
                            <a th:href="'/blog/'+${blog.id}" href="blog.html">查看更多</a>
                        </div>
                        <div class="soci">
                            <p>
                                <a class="span_link" ><span class="glyphicon glyphicon-comment"></span><span th:text="${blog.commentCount}">0</span></a>
                                <a class="span_link" ><span class="glyphicon glyphicon-eye-open"></span><span th:text="${blog.readNum}">56</span></a>
                            </p>
                        </div>
                        <div class="clearfix"></div>
                    </div>
                    <div class="clearfix"></div>
                </div>
                <nav class="paging wow fadeInDown" data-wow-duration=".5s" data-wow-delay=".2s" style="text-align: center">
                    <ul class="pagination pagination-mg" th:utext="${pageNation}" >
                    </ul>
                </nav> <!--分页结束-->
            </div>
        </div><!--左侧内容结束-->

        <div class="col-md-3 technology-right" th:include="foreground/common::rightNav" ></div><!--右侧内容结束-->

        <div class="clearfix"></div>
    </div>
</div><!--内容主体结束-->

<div class="footer" th:include="foreground/common::footer"></div><!--尾部结束-->

<div class="copyright wow fadeInDown" data-wow-duration=".8s" data-wow-delay=".2s" th:include="foreground/common::copyright"></div><!--版权区结束-->

<img id="oImg" th:src="@{/foreground/images/xiaolongbao.gif}" src="../../static/foreground/images/xiaolongbao.gif" />

<script src="http://cdn.bootcss.com/jquery/2.2.4/jquery.min.js"></script>
<script src="http://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="http://cdn.bootcss.com/wow/1.1.2/wow.min.js"></script>
<script src="http://op93pqovl.bkt.clouddn.com/js/jquery.svg3dtagcloud.min.js"></script>
<script src="http://cdn.bootcss.com/modernizr/2.6.2/modernizr.min.js"></script>
<script src="http://op93pqovl.bkt.clouddn.com/js/jquery.dropdown.js"></script>
<script src="http://op93pqovl.bkt.clouddn.com/js/time.js"></script>
<script th:src="@{/foreground/js/myjs.js}" type="text/javascript" src="../../static/foreground/js/myjs.js"></script>
<script src="http://cdn.bootcss.com/jquery-mousewheel/3.0.6/jquery.mousewheel.min.js" type="text/javascript"></script>
<script src="http://cdn.bootcss.com/malihu-custom-scrollbar-plugin/3.1.3/jquery.mCustomScrollbar.min.js" type="text/javascript"></script>
<script src="http://op93pqovl.bkt.clouddn.com/js/jquery.emoji.js" type="text/javascript" ></script>
<script  th:inline="javascript">
    $(document).ready(function () {
        var blogTagList=[[${application.blogTagList}]];
        var entries=[];
        for(var i in blogTagList){
            var entry={
                label:blogTagList[i].tagName,
                url: '/blog/tag/'+blogTagList[i].id
            }
            entries.push(entry);
        }
        var settings = {
            entries: entries,
            width: '100%',
            height: '100%',
            radius: '73%',
            radiusMin: '50%',
            bgDraw: true,
            bgColor: '#FFF',
            opacityOver: 1.00,
            opacityOut: 0.13,
            opacitySpeed: 6,
            fov: 800,
            speed: 0.5,
            fontFamily: 'Oswald, Arial, sans-serif',
            fontSize: '15',
            fontColor: '#000',
            fontWeight: 'normal',//bold
            fontStyle: 'normal',//italic
            fontStretch: 'normal',//wider, narrower, ultra-condensed, extra-condensed, condensed, semi-condensed, semi-expanded, expanded, extra-expanded, ultra-expanded
            fontToUpperCase: false

        };

        //var svg3DTagCloud = new SVG3DTagCloud( document.getElementById( 'holder'  ), settings );
        $('#tag-cloud').svg3DTagCloud(settings);
        parse()
    });



</script>
</body>
</html>